var y = 1;
var fileId;

// 创建大屏
function addLi() {
    var parm = {};
    parm.groupName = $('#group_new_name').val();
    parm.fileId = fileId;

    $.ajax({
        type: "post",
        url: ctp + "/panel/insert", //查询全部的PanelGroup
        cache: false,
        data: parm,
        async: false,
        success: function (result) {
            if (result.code == "200") {
                alert("创建成功！");
                $('.tab').hide();
                $('#group_new_name').val('');
                $('#background_image').attr("src", "../../assets/img/noPicture.png");
                queryByName();
                editPanel();
            } else {
                alert(result.msg);
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("网络异常");
        }
    });
}

// 帮助
$('.help').on('click', function () {

    $.ajax({
        type: 'post',
        data: '',
        url: '#',
        success: function (data) {
            console.log(data)
            alert('请选择帮助');
        }
    })
})

// 导入大屏
$('.btn-daoru').on('click', function () {

    $.ajax({
        type: 'post',
        data: '',
        url: '#',
        success: function (data) {
            console.log(data)
            alert('导入成功');
        }
    })
})

// 导出大屏
$('.btn-daochu').on('click', function () {
    $.ajax({
        type: 'post',
        data: '',
        url: '#',
        success: function (data) {
            console.log(data)
            alert('导出成功');
        }
    })
})

// 大屏页面跳转
function opentc(groupId) {
    window.location.href = '../tuceng/tuceng.html?groupId=' + groupId;
}

/*// 大屏页面删除
$('.delIcon').on('click',function (e){
	var confim = confirm('你确定要删除大屏吗？');
	if(confim==true){
		e.currentTarget.parentNode.parentNode.remove();
	}
})
$('.addLi').on('mousedown','.delIcon',function (e){
	var confim = confirm('你确定要删除大屏吗？');
	if(confim==true){
		e.currentTarget.remove();
	}
	// console.log(e)
})*/


// 新建数据库
function shownum() {
    $('.sj-Num').css({
        'display': 'block',
        'transition': 'all 1s ease'
    });
}

function hidenum() {
    $('.sj-Num').css('display', 'none');
}

// 新建组
$('.tab-button').click(function () {
    $('.tab').show();
})

function Hide() {
    $('.tab').hide();
}

// 新建数据源
$('.sj-button').click(function () {
    $('.sj-num').css('display', 'block');
    $('.lTop').css('display', 'none');
})
$('.sj-top .iconfont').click(function () {
    $('.sj-num').hide();
    $('.lTop').show();
})

/*// 鼠标移入移除事件
$('.addLi').on('mouseover','.SJBli',function (e){
	var SJbList = e.currentTarget.childNodes
	for(var x = 0;x<SJbList.length;x++){
		SJbList[3].style.display='block'
	}
})
$('.addLi').on('mouseout','.SJBli',function (e){
	var SJbList = e.currentTarget.childNodes
	for(var x = 0;x<SJbList.length;x++){
		SJbList[3].style.display='none'
	}
})*/
function SJout() {
    $('.sj-li').find('.sj-fu').hide();
}

// 返回

$('.layui-logo').click(function () {
    window.history.go(-1);
})

var i = 0;
// 侧栏显示隐藏切换
$('.look').click(function () {
    if (i == 0) {
        $('.layui-body').css({
            'left': '40px',
            'z-index': '1000',
            'transition': ' all 0.5s ease'
        })
        $('.look').css({
            'width': '50px',
            'padding': '0',
            'transition': ' all 0.5s ease'
        })
        i = 1;
    } else {
        $('.layui-body').css({
            'left': '150px',
            'transition': ' all 0.5s ease'
        })
        // $('.work-look1').css({'visibility': 'hidden'})
        $('.look').css({
            'width': '120px',
            'padding': '0 15px',
            'transition': ' all 0.5s ease'
        })
        i = 0;
    }
})

layui.use(['slider', 'form', 'colorpicker', 'element'], function () {
    var slider = layui.slider;
    var form = layui.form;
    var colorpicker = layui.colorpicker;
    var element = layui.element;
    //渲染
    form.on('switch(test)', function (data) {
        console.log(data.elem); //得到checkbox原始DOM对象
        console.log(data.elem.checked); //开关是否开启，true或者false
        if (data.elem.checked) {

        } else {

        }

    });
    slider.render({
        elem: '#slideTest1', //绑定元素
        value: 30, //初始值
        theme: '#88d5f2', //主题色
    });
});

// $(function () {
//     // var cont = $('#container').html();
//
// 	var baseCtx = "http://localhost/web/dataLoad";
// 	$.ajax({
// 		url: baseCtx+"/showBaseData",
// 		type: "post",
// 		cache: false,
// 		async: false,
// 		data: {
// 			userId:1,
// 			// name:"大屏",
// 		},
// 		dataType: "json",
// 		success: function(data){
// 			console.log(data);
// 			// SJB-ul	父目录class
// 			// $.each(eval(data['data']),function(index,element){}
// 			var content = data.data;
// 			//拼接字符串
// 			var str = '';
// 			console.log(content);
// 			// console.log(content.length);
// 			/* for(var i=0;i<content.length;i++){
// 				if(content[i].pd == 0){
// 					console.log("该元素是大屏分组"+element[i].name);
// 					// str += '<li class="SJB_li">'+
// 					// 		   '<a href="tuceng.html">'+
// 					// 			   '<div class="SJBL-top"></div>'+
// 					// 			   '<div class="SJBL-bottom">'+
// 					// 				   '<div>'+
// 					// 					   '<div class="enjoy">'+element[i].name+'</div>'+
// 					// 					   '<span>'+element[i].createTime+'</span>'+
// 					// 				   '</div>'+
// 					// 			   '</div>'+
// 					// 		   '</a>'+
// 					// 		'</li>';
//
// 				}else{
// 					console.log("该元素是大屏"+element[i].name);
// 					// str += '<li class="SJB_li">'+
// 					// 		   '<div class="SJBL-top"></div>'+
// 					// 		   '<div class="SJBL-bottom">'+
// 					// 			   '<div class="SJBL_left">'+
// 					// 				   '<div class="enjoy">'+element[i].name+'</div>'+'+
// 					// 				   '<span>'+element[i].createTime+'</span>'+
// 					// 			   '</div>'+
// 					// 			   '<div class="SJBL_right">'+
// 					// 				   '<div class="lcs_wrap"><input type="checkbox" name="check-1" value="4" class="lcs_check" autocomplete="off"><div class="lcs_switch  lcs_off lcs_checkbox_switch"><div class="lcs_cursor"></div><div class="lcs_label lcs_label_on">是</div><div class="lcs_label lcs_label_off">否</div></div></div>'+
// 					// 				   '<p>未发布</p>'+
// 					// 			   '</div>'+
// 					// 		   '</div>'+
// 					// 		'</li>';
// 				}
//
//
// 			}
// 			 */
// 			$.each(content,function(index,element){
// 				console.log("----");
// 				console.log(element);
// 				console.log(index);
// 				console.log(element[index].name);
//
// 			})
// 		},
// 		error: function(){
// 			alert("网络错误");
// 		}
// 	})
//
// })

//获取panel_group
$(function () {
    //页面加载成功后
    //渲染已有的大屏组数据
    initPanleGroup();
    //查询按钮
    $('#queryPanelGroup').on('click', function () {
        var groupName = $('#group_name').val();
        queryByName(groupName);
    });

    //新增按钮
    $('#newPanelGroup').click(function () {
        addLi();
    });

    //编辑按钮
    editPanel();

});

function initPanleGroup() {
    $.ajax({
        type: "post",
        url: ctp + "/panel/queryAll", //查询全部的PanelGroup
        cache: false,
        data: {},
        async: false,
        success: function (result) {
            if (result.code == "200") {

                var list = result.data;
                var liHtml = '';
                liHtml += '<li class="SJB_li newPanelGroup">' +
                    '<div class="icon">' +
                    '<i class="iconfont">&#xe602;</i>' +
                    '</div>' +
                    '<p class="cuj">新建</p>' +
                    '</li>';
                for (var i = 0; i < list.length; i++) {
                    //此处循坏拼接html
                    var groupId = list[i].groupId;
                    var groupName = list[i].groupName;
                    var url = ctp + "/static/" + list[i].fileUrl;
                    var createTime = list[i].createTime;
                    var status = list[i].status;
                    var fileId = list[i].fileId;

                    liHtml +=
                        '<li class="SJB_li SJBli">' +
                        '<a href="#">' +
                        '<div class="SJBL-top">' +
                        '<img src="' + url + '" class = "list-panel-img" onerror="showDefaultImg(this)">' +
                        '</div>' +
                        '<div class="SJBL-bottom">' +
                        '<div>' +
                        '<div class="enjoy">' + groupName + '</div>' +
                        '<span>' + new Date(createTime).format("yyyy-MM-dd hh:mm:ss") + '</span></div>' +
                        '</div></a>' +
                        '<div class="sj-fu SJBli-li" >' +
                        '<i class="iconfont" title="编辑" onclick="opentc(' + groupId + ')">&#xe66f;</i>' +
                        '<i class="iconfont delIcon" title="删除" onclick="deletePanelGroup(' + groupId + ');">&#xe601;</i>' +
                        '</div>' +
                        '</li>';
                }
                $('.addLi').html(liHtml);
            } else {
                alert(result.msg);
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("网络异常");
        }
    });
}

function queryByName(name) {
    $.ajax({
        type: "post",
        url: ctp + "/panel/queryAll",
        cache: false,
        data: {"groupName": name},
        success: function (result) {
            if (result.code == "200") {

                var list = result.data;
                var liHtml = '';
                liHtml += '<li class="SJB_li newPanelGroup">' +
                    '<div class="icon">' +
                    '<i class="iconfont">&#xe602;</i>' +
                    '</div>' +
                    '<p class="cuj">新建</p>' +
                    '</li>';

                for (var i = 0; i < list.length; i++) {
                    //此处循坏拼接html
                    var groupId = list[i].groupId;
                    var groupName = list[i].groupName;
                    var url = ctp + "/static/" + list[i].fileUrl;
                    var createTime = list[i].createTime;
                    var status = list[i].status;
                    var fileId = list[i].fileId;

                    liHtml += '<li class="SJB_li SJBli">' +
                        '<a href="#">' +
                        '<div class="SJBL-top">' +
                        '<img src="' + url + '" class = "list-panel-img" onerror="showDefaultImg(this)">' +
                        '</div>' +
                        '<div class="SJBL-bottom">' +
                        '<div>' +
                        '<div class="enjoy">' + groupName + '</div>' +
                        '<span>' + new Date(createTime).format("yyyy-MM-dd hh:mm:ss") + '</span>' +
                        '</div>' +
                        '</div>' +
                        '</a>' +
                        '<div class="sj-fu SJBli-li" >' +
                        '<i class="iconfont" title="编辑" onclick="opentc(' + groupId + ')">&#xe66f;</i>' +
                        '<i class="iconfont delIcon" title="删除" onclick="deletePanelGroup(' + groupId + ');">&#xe601;</i>' +
                        '</div>' +
                        '</li>';

                }
                $('.addLi').html(liHtml);
            } else {
                alert(result.msg);
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("网络异常");
        }
    });
}

function editPanel() {
    $('.addLi').on('mouseover', '.SJBli', function () {
        $(this).closest('.SJBli').find('.SJBli-li').show();
        $(this).closest('.SJBli').find('.SJBli-li').css('transition', 'all 1s ease');
    });

    $('.addLi').on('mouseout', '.SJBli', function () {
        $(this).closest('.SJBli').find('.SJBli-li').hide();
    });
}

function deletePanelGroup(groupId) {
    var confim = confirm('你确定要删除吗?');
    if (confim == true) {
        $.ajax({
            type: "post",
            url: ctp + "/panel/deletePanelGroup", //查询全部的PanelGroup
            cache: false,
            data: {"groupId": groupId},
            async: false,
            success: function (result) {
                if (result.code == "200") {
                    alert("删除成功！")
                    queryByName();
                } else {
                    alert(result.msg);
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert("网络异常");
            }
        });
    }
}

//新建大屏组
$('.addLi').on('click', '.newPanelGroup', function () {
    $('.tab').show();
});

//封面图上传
function xmTanUploadImg(obj) {
    var formData = new FormData();
    formData.append("file", obj.files[0]);
    formData.append("operation", "insert");
    $.ajax({
        type: "post",
        url: ctp + "/sysFile/uploadImage",
        cache: false,
        data: formData,
        processData: false,
        contentType: false,
        async: false,
        success: function (result) {
            if (result.code == "200") {
                fileId = result.data.fileId;
                var url = ctp + "/static/" + result.data.fileUrl;
                $('#background_image').attr("src", url);
            } else {
                alert(result.msg);
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("网络异常");
        }
    });
}

function showDefaultImg(img) {
    img.src = "../../assets/img/noPicture.png";
    //不循环执行
    img.onerror = null;
}
